<template>
	<div class="header-container">
		<img v-on:click="back" class="arrow-left" src="../../images/icon/arrow.png">
		<div class="btn-container">
			<router-link to="/home"><div class="btn">关注</div></router-link>
			<!-- <router-link to="/home"><div class="btn">我要推广</div></router-link> -->
			<router-link to="/upgrade"><div class="btn">升级会员</div></router-link>
			<router-link to="/home"><div class="btn">返回首页</div></router-link>
		</div>

	</div>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
		back() {
			this.$router.go(-1);
		}
  }
};
</script>

<style lang="scss" scoped>
@import "../../style/mixin";

.header-container {
  @include fj(space-between);
  align-items: center;
  background: #666;
  height: 1rem;
  line-height: 1rem;
  padding: 0 0.1rem;

  .arrow-left {
    transform: rotate(90deg);
    height: 0.4rem;
    width: 0.4rem;
  }

  .btn-container {
    @include fj(space-around);
  }

  .btn {
    @include sc(0.3rem, #fff);
    padding: 0 0.1rem;
  }
}
</style>
